<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>find和findindex()</title>
</head>
<body>
    <h1>find和findIndex方法的区别</h1>
    <p>Array.prototype.find()和Array.prototype.findIndex()都是ES6新增的数组方法,用于查找数组中的元素。</p>

    <h2>find方法</h2>
    <ul>
        <li>find方法用于找出第一个符合条件的数组元素</li>
        <li>参数是一个回调函数</li>
        <li>找到返回该元素,找不到返回undefined</li>
    </ul>

    <h2>findIndex方法</h2>
    <ul>
        <li>findIndex方法用于找出第一个符合条件的数组元素的位置</li>
        <li>参数也是一个回调函数</li>
        <li>找到返回该元素的索引,找不到返回-1</li>
    </ul>

    <h3>示例代码:</h3>
    <pre>
    // find示例
    [1, 4, -5, 10].find((n) => n < 0) // 返回 -5
    
    // findIndex示例
    [1, 4, -5, 10].findIndex((n) => n < 0) // 返回 2
    </pre>

    <p>两者的主要区别:</p>
    <ul>
        <li>find返回元素本身</li>
        <li>findIndex返回元素的位置(索引)</li>
        <li>都只能找到第一个满足条件的值</li>
        <li>找不到时find返回undefined,findIndex返回-1</li>
    </ul>
</body>
<script>   

</script>
</html>

